<template>
  <view class="content">
    <div class="box">
      <div class="money">
        <div class="t">
          <div class="num">
            <p>我的团队 (人)</p>
            <p>230</p>
          </div>
          <div class="num">
            <p>总收益 (元)</p>
            <p>89078.00</p>
          </div>
        </div>
      </div>
      <div class="teamMoney" v-for="ts in teamInfos">
        <div class="t">
          <div class="one">
            <image src="../../static/1.png" mode="widthFix"></image>
            <a>张三</a>
            <div class="phone">联系方式: 13882008345</div>
          </div>
          <div class="num">
            <p style="margin-right: 20px" >总提成 (元)</p>
            <p>00.00</p>
          </div>
        </div>
      </div>
    </div>
  </view>
</template>

<script>
// import Api from "../../API/api";
// export default {
//   data() {
//     return {
//       teamInfos:[1,2,3,4,5,6,7,8,9],
//       teamInfo:[]
//     }
//   },
//   onLoad() {
//     Api.getLeaderboard().then(res=>{
//       this.teamInfo = res.data;
//       console.log(this.teamInfo)
//     })

//   },
//   methods: {
//     //收益明细
//     details(){
//       uni.navigateTo({
//         url : "/pages/index/money"
//       })

//     },
//     //提现
//     deposit(){
//       uni.navigateTo({
//         url : "/pages/index/withdraw"
//       })
//     }
//     }
// }
</script>

<style lang="less" scoped>
page {
  background-color: #f3f4f8;
}

.content {
  .box {
    transform: translateY(-150rpx);
    width: 90%;
    margin: auto;
    position: relative;
    top: 220rpx;
    .money {
      margin-top: 20rpx;
      border-radius: 20rpx;
      background-color: rgba(255, 255, 255, 0.8);
      box-sizing: border-box;
      padding: 20rpx 20rpx 0 20rpx;
      height: 80pt;

      .t {
        display: flex;
        justify-content: space-between;
        margin-top: 20rpx;
        margin-left: 50rpx;
        margin-right: 50rpx;
        p {
          &:nth-child(1) {
            color: #070E2F;
            font-size: 28rpx;
            color: #ccc;

          }

          &:nth-child(2) {
            color: #000;
            font-weight: 700;
            font-size: 56rpx;
          }
        }
      }
    }
    .teamMoney {
      margin-top: 20rpx;
      border-radius: 20rpx;
      background-color: rgba(255, 255, 255, 0.8);
      box-sizing: border-box;
      padding: 20rpx 20rpx 0 20rpx;
      height: 80pt;
      .t {
        display: flex;
        justify-content: space-between;
        margin-top: 5rpx;
        margin-left: 20rpx;
        margin-right: 20rpx;
        width: 95%;
        .num{
          display: flex;
          justify-content: space-between;
        }

        .one{
          width: 70%;
          a{
            position: relative;
            top: 11px;
            left: 5px;
            font-weight: 700;
          }
        }
        .phone{
          display: block;
          font-size: 12px;
          position: relative;
          top: 40px;
          //left: 0px;
          right: 60px;
          //height: 80%;
          color: #ccc;
        }

        image {
          width: 120rpx;
          border-radius: 50%;
          float: left;
        }

        p {
          &:nth-child(1) {
            color: #070E2F;
            font-size: 28rpx;
            color: #ccc;
            white-space: normal;
          }

          &:nth-child(2) {
            color: #000;
            font-weight: 700;
            //font-size: 56rpx;

          }
        }
      }
    }
  }



}
</style>